<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>修改商品</title>
	<style>
		#app {
			margin: 20px;
			padding: 20px;
			border: 1px solid #ccc;
			border-radius: 5px;
			background-color: #f9f9f9;
			width:950px;
		}
		label {
			display: block;
			margin-bottom: 10px;
			font-weight: bold;
		}
		input[type="text"], select {
			display: block;
			margin-bottom: 10px;
			padding: 5px;
			border: 1px solid #ccc;
			border-radius: 3px;
			width: 100%;
			box-sizing: border-box;
		}
		input[type="button"] {
			background-color: #fbc2eb;
			color: white;
			padding: 10px 20px;
			border: none;
			border-radius: 3px;
			cursor: pointer;
		}
		input[type="button"]:hover {
			background-color: rgb(255, 128, 192);
		}
	</style>
	<script type="text/javascript" src="js/vue-2.6.10.js"></script>
  	<script type="text/javascript" src="js/axios.js"></script>
</head>
<body>
	
	<div   id="app">
		<input type="hidden" v-model='commod.cNumber' name="cNumber">
		<label for="commod_modify_name">商品名：</label>
		<input type="text" id="commod_modify_name" v-model='commod.cName' name="cName" >

		<label for="commod_modify_price">商品价格：</label>
		<input type="text" id="commod_modify_price" v-model='commod.cPrice' name="cPrice">

		<label for="commod_modify_inventory">商品库存：</label>
		<input type="text" id="commod_modify_inventory" v-model='commod.cInventory' name="cInventory" >

		<input type="button" value="保存" @click="updateCommod">
	</div>
	 <script type="text/javascript">
	 function parseUrlParams() {
 	    var url = window.location.href;
 	    var paramString = url.split('?')[1];
 	    var paramPairs = paramString.split('&');
 	    var params = {};

 	    paramPairs.reduce(function(params, pair) {
 	        var parts = pair.split('=');
 	        var key = parts[0];
 	        var value = decodeURIComponent(parts[1] || '');

 	        if (params[key]) {
 	            params[key].push(value);
 	        } else {
 	            params[key] = [value];
 	        }

 	        return params;
 	    }, params);

 	    return params;
 	}
	 
	 
  	  let vue = new Vue({
  		  el:'#app',
  		  data:{
  			  commod:{
  				  
  				  cPrice:'',
  				  cInventory:'',
  				  cNumber:'',
  				  cName:'',
  				  
  				  
  			  }
  		  },
  		  created(){
  			  params = parseUrlParams();
  			  //url:表示异步请求地址
  			  axios.get('/OrderServert/emp.do/'+params.id[0]).then(
  				function(res_obj){
  					vue.commod = res_obj.data.data;
  					//console.log(res_obj.data.data.rows);
  					//console.log(vue.commod);
  				}	  
  			  ).catch(
						function(error_obj){
							alert("数据加载异常！！！");
						}
				)
  		  },
  		  methods: {
  			  updateCommod: function(){
  				param = "cName="+vue.commod.cName +"&cNumber="+vue.commod.cNumber+"&cPrice="+vue.commod.cPrice+"&cInventory="+vue.commod.cInventory;
  				axios.put('/OrderServert/emp.do?'+param).then(
	  				function(res_obj){
	  					//vue.commod = res_obj.data.data;
	  					//console.log(res_obj.data.data.rows);
	  					//console.log(vue.commod);
	  					window.location.href="commod.html";
	  				}	  
	  			  ).catch(
							function(error_obj){
								alert("数据加载异常！！！");
							}
					)
  			  }
  			  
  		  }
  	  });
  
  </script>
</body>
</html>
